<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <title>岚山一中一卡通</title>
    <link rel="stylesheet" href="/css/weui.min.css"/>
    <link rel="stylesheet" href="/css/myWxmp.css"/>
</head>
<body ontouchstart>
<div class="weui-toptips weui-toptips_warn js_tooltips">卡号不对或者未录入持卡人</div>

<div class="container" id="container">
    <div class="page js_show">
        <div class="page__hd">
            <h1 class="page__title">饭卡充值</h1>
            <p class="page__desc">您还未绑定卡，请先绑定</p>
        </div>
        <div class="page__bd">
            <div class="weui-cells__title">卡号</div>
            <div class="weui-cells">
                <div class="weui-cell">
                    <div class="weui-cell__bd">
                        <input class="weui-input" id="cardNo" type="number" pattern="[0-9]*" placeholder="请输入号码"/>
                    </div>
                </div>
            </div>
            <div class="weui-cells__title">持卡人</div>
            <div class="weui-cells">
                <div class="weui-cell">
                    <div class="weui-cell__bd">
                        <input class="weui-input" id="cardOwner" type="text" placeholder="不需要录入，确认使用" readonly="readonly"/>
                    </div>
                </div>
            </div>
            <br/>
            <div class="weui-btn-area">
                <a href="javascript:;" class="weui-btn weui-btn_primary" id="confirm_bind_card">确认</a>
            </div>
        </div>
        <div class="weui-msg__extra-area">
            <div class="weui-footer">
                <p class="weui-footer__text">Copyright &copy; 2018-2019</p>
            </div>
        </div>
    </div>
</div>
<script src="/js/zepto.min.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script src="https://res.wx.qq.com/open/libs/weuijs/1.0.0/weui.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('#confirm_bind_card').on('click', function () {
            var cn = $.trim($("#cardNo").val());
            var co = $.trim($("#cardOwner").val());
            if (cn == '') {
                var $tooltips = $('.js_tooltips');
                if ($tooltips.css('display') != 'none') return;
                $('.page.cell').removeClass('slideIn');
                $tooltips.css('display', 'block');
                setTimeout(function () {
                    $tooltips.css('display', 'none');
                }, 2000);
                return;
            } else if(co == ''){
                $.ajax({
                    url: '/wxpay/getCardOwnerByCardNo',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        cardNo: cn
                    },
                    success: function (result) {
                        if (result.success) {
                            $("#cardOwner").val(result.data);
                            var $tooltips = $('.js_tooltips');
                            if ($tooltips.css('display') != 'none') return;
                            $('.page.cell').removeClass('slideIn');
                            $tooltips.html("请仔细核对卡号和持卡人确认正确，再次确认进行绑卡")
                            $tooltips.css('display', 'block');
                            setTimeout(function () {
                                $tooltips.css('display', 'none');
                            }, 2000);
                            return;
                        } else {
                            showFailure(result.msg);
                        }
                    },
                    error: function () {
                        showFailure('网络异常，绑卡失败');
                    }
                })
            }else {
                $.ajax({
                    url: '/wxpay/bindCard',
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        cardNo: cn,
                        cardOwner: co
                    },
                    success: function (result) {
                        if (result.success) {
                            window.location.href = "bindCardSuccess.html";
                        } else {
                            showFailure(result.msg);
                        }
                    },
                    error: function () {
                        showFailure('网络异常，绑卡失败');
                    }
                })
            }
        });
    });

    function showFailure(msg){
        window.location.href='failure.html?failTip='+encodeURIComponent(msg);
    }
</script>
</body>
</html>
